<template>
  <div>
    <a-modal
      title="修改地址"
      :width="400"
      :confirm-loading="addressModalLoading"
      :mask-closable="false"
      :destroy-on-close="true"
      :visible="visible"
      @ok="onSetAddress()"
      @cancel="$emit('update:visible', false)"
    >
      <a-form layout="inline">
        <a-row>
          <a-form-item>收件人：<a-input v-model="address.name" /></a-form-item>
        </a-row>
        <a-row>
          <a-form-item>电话：<a-input v-model="address.phone" type="phone" /></a-form-item>
        </a-row>
        <a-row>
          <a-form-item prop="Area">
            地区：
            <city-select v-model="area" :props="{ expandTrigger: 'hover' }" data-type="area" value-type="2">
            </city-select>
          </a-form-item>
        </a-row>
        <a-row>
          <a-form-item>详细地址：<a-input v-model="address.detail" /></a-form-item>
        </a-row>
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import CitySelect from '@/components/CitySelect/CitySelect'
import {
  modifyPrice,
  getOrderList,
  orderCancel,
  setComments,
  setAddress,
  orderSend,
  orderConfirm,
  orderPrint,
  orderClerk,
} from '@/api/order'
export default {
  components: {
    CitySelect,
  },
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    orderId: {
      type: String,
      default: '',
    },
    order: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      area: [],
      address: {},
      addressModalLoading: false,
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    if(this.order.address_data) {
      this.address = {
        name:this.order.name,
        phone:this.order.mobile,
        detail:this.order.address,
      }
      this.area = [this.order.address_data.province,this.order.address_data.city,this.order.address_data.district]
    }
  },
  updated() {},
  methods: {
    onSetAddress() {
      var params = {
        orderId: this.orderId,
        name: this.address.name,
        mobile: this.address.phone,
        address: this.address.detail,
        province: this.area[0],
        city: this.area[1],
        district: this.area[2],
      }
      setAddress(params)
        .then((res) => {
          if (res.code !== 0) {
            this.$error({
              content: res.msg,
            })
          } else {
            this.$message.success('修改成功')
            this.$emit('update:visible', false)
            this.$emit('onAfterClose')
          }
        })
        .catch((err) => {
          this.$message.error(err.message)
        })
    },
  },
}
</script>

<style scoped>
</style>